<template>
    <div >
       <!-- <el-tabs v-model="activeName"  class="demo-tabs" @click="openDetailForm">
            <el-tab-pane label="公司简介" name="first"></el-tab-pane>
            <el-tab-pane label="动态" name="second"></el-tab-pane>
            <el-tab-pane label="案例" name="third"></el-tab-pane>
            <el-tab-pane label="合作招募" name="fourth"></el-tab-pane>
            <el-tab-pane label="联系我们" name="fifth"></el-tab-pane>
            <el-tab-pane label="导航栏" name="sixth"></el-tab-pane>
        </el-tabs> -->
    <article-list-detail   :activeName="activeName" ></article-list-detail>
    <!-- <nav-tree  v-if="pageNum == 1"> </nav-tree> -->
    <!-- <question-list-detail v-if="activeName == 'second'" :activeName="activeName"></question-list-detail> -->
    <!-- <detail-form v-model:dialogDrawer="dialogRelationQuestionVisible" :defaultForm="form"></detail-form> -->
    </div>
</template>
  
<script>
import { reactive, toRefs, onMounted } from 'vue'
import ArticleListDetail from './components/ArticleListDetail.vue'
import DetailForm from './components/DetailForm.vue'
import NavTree from './nav/NavTree.vue'
export default {
    name: 'Paper',
    components: {
        ArticleListDetail,
        DetailForm,
        NavTree
    },
    setup() {
        const state = reactive({
            activeName: 'first',
            dialogRelationQuestionVisible:false,
            form:{},
            pageNum:0
        })

        const openDetailForm =(val) =>{
            // state.dialogRelationQuestionVisible = true
            if(state.activeName == 'sixth'){
                state.pageNum = 1
            }else if(state.activeName == 'fifth'){
                state.pageNum = 2
            }else{
                state.pageNum = 0
            }

        }
        // onMounted(() => {



        // })


        return {
            openDetailForm,
            ...toRefs(state)
        }
    }
}
</script>
  
<style lang="scss" scoped>
.page-container {
    .table-list {
        background: var(--next-color-white);
        margin-top: 10px;

        :deep(.el-table__header-wrapper .el-table__cell) {
            background: var(--el-color-primary-light-9);
            color: var(--next-bg-menuBar-light-1);
        }
    }
}
</style>